<template>
  <div>
    <van-sticky>
      <van-nav-bar
        :title="type == 'classNo' ? '设置班级' : '设置学号'"
        left-text="取消"
        left-arrow
        right-text="完成"
        @click-left="onClickLeft"
        @click-right="onClickRight"
      />
    </van-sticky>
    <div class="content">
      <van-field
        v-if="type == 'code'"
        v-model="setUserInfo.code"
        label=""
        placeholder="请输入学号"
        clearable
      />
      <van-field
        v-else
        v-model="setUserInfo.classNo"
        label=""
        placeholder="请输入班级"
        clearable
      />
    </div>
  </div>
</template>

<script lang="ts">
import { defineComponent, ref, reactive } from 'vue'
import { Notify } from 'vant'
import { useRouter } from 'vue-router'
import { update } from '/@/api/system/user'

export default defineComponent({
  components: {
    [Notify.Component.name]: Notify.Component,
  },
  props: {
    userInfo: {
      type: Object as any,
      default: () => {
        return {
          realName: '',
        }
      },
    },
    type: {
      type: String,
      default: 'code',
    },
  },
  setup(props, content) {
    const code = ref<string>('')
    const classNo = ref<string>('')
    const parent = { ...content }
    const router = useRouter()
    const setUserInfo: users = reactive({
      code: '',
      classNo: '',
    })

    interface users {
      code: any
      classNo: any
    }

    const show = () => {
      let info = {
        type: props.type,
        code: setUserInfo.code,
        classNo: setUserInfo.classNo,
      }
      parent.emit('info', info)
    }

    const show2 = () => {
      let info = {
        name: '',
      }
      parent.emit('cancel', info)
    }

    const onClickRight = () => {
      let user = []
      user.push(props.userInfo)
      if (props.type == 'code') {
        user[0].code = setUserInfo.code
      } else {
        user[0].classNo = setUserInfo.classNo
      }
      update(user).then(() => {
        Notify({ type: 'success', message: '修改完成' })
        show()
      })
    }
    return {
      code,
      classNo,
      setUserInfo,
      onClickLeft() {
        show2()
      },
      onClickRight,
    }
  },
})
</script>

<style lang="less" scoped></style>
